<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>cyon'works</title>

    <style>
        button,div {
            font-size: xx-large;
        }
        div#result {
            position: fixed;
            left:50%;
            bottom:16%;
        }
        li {
            margin-top: 4%;
        }
    </style>
    <script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            $("button").click(function () {
                var door = $(this).attr('id');
                console.log(door);
                $.post("/open",{"door":door},function (result) {
                    $("#result").html(result);
                });
            });
        })
    </script>
</head>
<body>
<ul>
    <li><button id="1">西楼大门</button></li>
    <li><button id="2">东楼大门</button></li>
    <li><button id="3">西楼3层</button></li>
</ul>
<div id="result">

</div>
</body>
</html>